<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<div class="portlet box green">
	<div class="portlet-title">
		<div class="caption">
			<i class="fa fa-gift"></i>用户维护
		</div>
  </div>
  <div class="portlet-body form">
  	<form id="noticebill" class="form-horizontal form-bordered" action="/user/save" method="post" enctype="multipart/form-data">
  		
  		<table class="table">
  			<thead>
  				<tr style="background-color: #ddd;">
  					<th>客户信息</th>
  				</tr>
  			</thead>
  		</table>
        
  		<div class="form-group">
        <label class="col-md-3 control-label" style="">来电号码:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="telephone" required maxlength="11"/>
	        </div>
        </div>
      </div>
      
  		<div class="form-group">
	        <label class="col-md-3 control-label">客户姓名:</label>
	        <div class="col-md-4">
	        	<div class="input-icon right">
		        	<i class="fa"></i>
		          <input type="text" class="form-control" name="customerName" required maxlength="50"/>
		        </div>
	        </div>
       </div>
       
  		<div class="form-group">
        <label class="col-md-3 control-label">联系人:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="delegater" required maxlength="50"/>
	        </div>
        </div>
      </div>
      
       <table class="table">
  			<thead>
  				<tr style="background-color: #ddd;">
  					<th>货物信息</th>
  				</tr>
  			</thead>
  		</table>
       
  		<div class="form-group">
        <label class="col-md-3 control-label">品名:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="product" required maxlength="50"/>
	        </div>
        </div>
      </div>
      
  		<div class="form-group">
        <label class="col-md-3 control-label">件数:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="num" required maxlength="50"/>
	        </div>
        </div>
      </div>
      
  		<div class="form-group">
        <label class="col-md-3 control-label">重量:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="weight" required maxlength="50"/>
	        </div>
        </div>
      </div>
      
  		<div class="form-group">
        <label class="col-md-3 control-label">体积:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="volume" required maxlength="50"/>
	        </div>
        </div>
      </div>
      
  		<div class="form-group">
        	<label class="col-md-3 control-label">取件地址:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="pickaddress" required maxlength="50"/>
	        </div>
        </div>
      </div>
      
  		<div class="form-group">
        <label class="col-md-3 control-label">到达城市:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	          <input type="text" class="form-control" name="arrivecity" required maxlength="50"/>
	        </div>
        </div>
      </div>
      
  		<div class="form-group">
        	<label class="col-md-3 control-label">预约取件时间:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	        	<div class="input-group date date-picker" data-date-format="yyyy-mm-dd">
					<input type="text" class="form-control" name="pickdate" readonly required
						 maxlength="11"/>
					<span class="input-group-btn">
					<button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
					</span>
				</div>
	        </div>
        </div>
      </div>
      
      <div class="form-group">
        <label class="col-md-3 control-label">备注:</label>
        <div class="col-md-4">
        	<div class="input-icon right">
	        	<i class="fa"></i>
	        	<textarea rows="5" class="form-control" name="description" maxlength="255"></textarea>
	        </div>
        </div>
      </div>
      
      <div class="form-actions">
        <div class="col-md-9 col-md-offset-3">
          <button type="button" class="btn btn-primary" onclick="saveNoticebill(this)">
          	<spring:message code="btn.save"></spring:message>
          </button>
          <button type="reset" class="btn btn-default" onclick="cancel()">
          	<spring:message code="btn.return"></spring:message>
          </button>
        </div>
      </div>
      <input type="hidden" name="customerId"/>
      <input type="hidden" name="decidedzoneId"/>
      </form>
     </div>
	</div>
	
<script type="text/javascript" src="<c:url value="/static/custom/datepicker-util.js"></c:url>"></script>
<script type="text/javascript">
	var setting = {
		view: {
			selectedMulti: false
		},
		data: {
			simpleData: {
				enable: true
			}
		}
	};
	$(function(){
		$('#noticebill').validate({
			rules: {
				phone: {
					phone: true
				}
			}
		});
		
		$("input[name=telephone]").change(function(){
			var url = "${pageContext.request.contextPath }/noticebill/findCustomerByTelephone";
			var data = {"telephone":$(this).val()};
			$.post(url,data,function(data){
				if(data.code == 0) {
					$("input[name=customerId]").val(data.data.id);
					$("input[name=customerName]").val(data.data.name);
					$("input[name=delegater]").val(data.data.name);
					$("input[name=pickaddress]").val(data.data.address);
					$("input[name=decidedzoneId]").val(data.data.decidedzoneId);
				}
				
			})
		})
 		
	})
	
	function saveNoticebill(obj){
		
		if($('#noticebill').valid()){
			
			var formData = new FormData($('#noticebill')[0]);
			$.ajax({
				type: 'post',
				url: '<c:url value="/noticebill/add"></c:url>',
				data: formData,
				async: false,  
			    cache: false,  
			    contentType: false,  
			    processData: false, 
				success: function(data){
					if(data.code == 0) {
						layer.msg(data.message, {shift: 1});
						setTimeout(function(){
							$("#noticebill")[0].result();
						}, 1200);
					}else{
						layer.msg(data.message, {shift: 6});
					}
				}
			});
		}
	}
</script>